﻿<!--=== Style Switcher ===-->
<i class="style-switcher-btn fa fa-cogs hidden-xs"></i>
<div class="style-switcher animated fadeInRight">
    <div class="theme-close"><i class="icon-close"></i></div>
    <div class="theme-heading">@SiteResource.StyleSwitcherTitle</div>
    <ul class="list-unstyled">
        @for (int i=0; i<CacheHelper.Themes.Count; i++)
        {
            string theme=CacheHelper.Themes[i];
            string activeClass=string.Empty;
            string lastClass=string.Empty;
            if (theme.Equals(SiteConfiguration.MvcTheme,StringComparison.OrdinalIgnoreCase))
            {
                activeClass=" theme-active";
            }
            if ((i+1)%5==0)
            {
                lastClass=" last";
            }
            <text>
                <li class="theme-@theme@activeClass@lastClass" data-style="@theme" data-header="light"></li>
            </text>
        }
    </ul>
    <div style="margin-bottom:18px;"></div>
    <div class="theme-heading">@SiteResource.LayoutTitle</div>
    <div class="text-center">
        <a href="javascript:void(0);" class="btn-u btn-u-green btn-block active-switcher-btn wide-layout-btn">@SiteResource.LayoutWide</a>
        <a href="javascript:void(0);" class="btn-u btn-u-green btn-block boxed-layout-btn">@SiteResource.LayoutBoxed</a>
    </div>
</div><!--/style-switcher-->
<!--=== End Style Switcher ===-->
<script type="text/javascript">
    // <![CDATA[
    (function ()
    {
        function HandleBoxed()
        {
            jQuery('.boxed-layout-btn').click(function ()
            {
                jQuery(this).addClass("active-switcher-btn");
                jQuery(".wide-layout-btn").removeClass("active-switcher-btn");
                jQuery("body").addClass("boxed-layout container");
                var ajax = $.post("@Url.Content("~/home/changelayout")", "layout=boxed-layout container");
                ajax.done(function (data, textStatus, jqXhr)
                {
                    // Not implement.
                });
                ajax.fail(App.OnRequestFail);
            });
            jQuery('.wide-layout-btn').click(function ()
            {
                jQuery(this).addClass("active-switcher-btn");
                jQuery(".boxed-layout-btn").removeClass("active-switcher-btn");
                jQuery("body").removeClass("boxed-layout container");
                var ajax = $.post("@Url.Content("~/home/changelayout")","");
                ajax.done(function (data, textStatus, jqXhr)
                {
                    // Not implement.
                });
                ajax.fail(App.OnRequestFail);
            });
        }
        function HandleSwitcher()
        {
            var panel = jQuery('.style-switcher');
            var $ContentStyle = $("#style_color");
            jQuery('.style-switcher-btn').click(function ()
            {
                jQuery('.style-switcher').show();
            });

            jQuery('.theme-close').click(function ()
            {
                jQuery('.style-switcher').hide();
            });

            jQuery('li', panel).click(function ()
            {
                var color = jQuery(this).attr("data-style");
                var data_header = jQuery(this).attr("data-header");
                setColor(color, data_header);
                jQuery('.list-unstyled li', panel).removeClass("theme-active");
                jQuery(this).addClass("theme-active");
                var ajax = $.post("@Url.Content("~/home/changetheme")", "theme=" + color);
                ajax.done(function (data, textStatus, jqXhr)
                {
                    // Not implement.
                });
                ajax.fail(App.OnRequestFail);
            });

            var setColor = function (color, data_header)
            {
                var themeFolder = "@Url.Content("~/assets/css/themes/")";
                var endIndex = $ContentStyle.attr("href").indexOf(themeFolder) + themeFolder.length;
                var themesPath = $ContentStyle.attr("href").substring(0, endIndex);
                var logo1Path = themesPath + color + "/images/logo1-" + color + ".png";
                var logo2Path = themesPath + color + "/images/logo2-" + color + ".png";
                $ContentStyle.attr("href", themesPath + color + "/" + color + ".css");
                $("#logo-header").attr("src", logo1Path);
                $("#logo-footer").attr("src", logo2Path);
            }
        }
        $(document).ready(function ()
        {
            HandleBoxed();
            HandleSwitcher();
        });
    })();
    // ]]>
</script>